<template>
  <div class="side-right2">
    <div class="map" v-show="showMap" :class="mapz">
      <!--<baidu-map id="location" :zoom="zoom" :style="style" v-on:loaded="onLoaded" ref="baiduMap"></baidu-map>-->
      <amap id="location" :zoom="zoom" :style="style" v-on:loaded="onLoaded"></amap>
    </div>
    <button @click="onClick">点</button>
  </div>
</template>

<script type="text/ecmascript-6">
  import Amap from './components/vue-amap/AMap'
  // import Test from './components/Test'
  // import location from './utils/location'

  export default {
    name: 'app',
    data () {
      return {
        msg: 'hello vue',
        zoom: 15,
        showMap: true,
        mapz: 'up',
        coordinates: {
          lng: 110.330055,
          lat: 20.05285
        },
        style: 'height:600px'
      }
    },
    methods: {
      onLoaded (coordinates) {
        window.alert(JSON.stringify(coordinates))
      }
//      onClick () {
//        this.style = 'height:600px'
//        this.$refs.baiduMap.refresh()
//        this.showMap = !this.showMap
//      }
    },
//  created() {
//    location.getCoordinates((response) => {
//      window.alert(JSON.stringify(response));
//    })
//  },
    components: {
      Amap
    }
  }
</script>

<style>

</style>
